.dropdown {
    position: absolute;
    z-index: 1070;
    top: -9999px;
    left: -9999px;

    display: block;

    &-hidden {
        display: none;
    }

    .effect() {
        transform-origin: 0 0;
        display: block !important;
        animation-duration: 0.15s;
        animation-fill-mode: both;
    }

    &-slide-up-enter,
    &-slide-up-appear {
        .effect();

        opacity: 0;
        animation-play-state: paused;
        animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
    }

    &-slide-up-leave {
        .effect();

        opacity: 1;
        animation-play-state: paused;
        animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);
    }

    &-slide-up-enter&-slide-up-enter-active&-placement-bottomLeft,
    &-slide-up-appear&-slide-up-appear-active&-placement-bottomLeft,
    &-slide-up-enter&-slide-up-enter-active&-placement-bottomCenter,
    &-slide-up-appear&-slide-up-appear-active&-placement-bottomCenter,
    &-slide-up-enter&-slide-up-enter-active&-placement-bottomRight,
    &-slide-up-appear&-slide-up-appear-active&-placement-bottomRight {
        animation-name: dropdown-slide-up-in;
        animation-play-state: running;
    }

    &-slide-up-enter&-slide-up-enter-active&-placement-topLeft,
    &-slide-up-appear&-slide-up-appear-active&-placement-topLeft,
    &-slide-up-enter&-slide-up-enter-active&-placement-topCenter,
    &-slide-up-appear&-slide-up-appear-active&-placement-topCenter,
    &-slide-up-enter&-slide-up-enter-active&-placement-topRight,
    &-slide-up-appear&-slide-up-appear-active&-placement-topRight {
        animation-name: dropdown-slide-down-in;
        animation-play-state: running;
    }

    &-slide-up-leave&-slide-up-leave-active&-placement-bottomLeft,
    &-slide-up-leave&-slide-up-leave-active&-placement-bottomCenter,
    &-slide-up-leave&-slide-up-leave-active&-placement-bottomRight {
        animation-name: dropdown-slide-up-out;
        animation-play-state: running;
    }

    &-slide-up-leave&-slide-up-leave-active&-placement-topLeft,
    &-slide-up-leave&-slide-up-leave-active&-placement-topCenter,
    &-slide-up-leave&-slide-up-leave-active&-placement-topRight {
        animation-name: dropdown-slide-down-out;
        animation-play-state: running;
    }

    @keyframes dropdown-slide-up-in {
        0% {
            transform-origin: 0% 0%;
            transform: scaleY(0);
            opacity: 0;
        }

        100% {
            transform-origin: 0% 0%;
            transform: scaleY(1);
            opacity: 1;
        }
    }

    @keyframes dropdown-slide-up-out {
        0% {
            transform-origin: 0% 0%;
            transform: scaleY(1);
            opacity: 1;
        }

        100% {
            transform-origin: 0% 0%;
            transform: scaleY(0);
            opacity: 0;
        }
    }

    @keyframes dropdown-slide-down-in {
        0% {
            transform-origin: 0% 100%;
            transform: scaleY(0);
            opacity: 0;
        }

        100% {
            transform-origin: 0% 100%;
            transform: scaleY(1);
            opacity: 1;
        }
    }

    @keyframes dropdown-slide-down-out {
        0% {
            transform-origin: 0% 100%;
            transform: scaleY(1);
            opacity: 1;
        }

        100% {
            transform-origin: 0% 100%;
            transform: scaleY(0);
            opacity: 0;
        }
    }
}
